﻿@{
    Layout = null;
}

<!DOCTYPE html>


<html lang="zh-cn" class="register_page">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>房都市 - 经纪人注册</title>

    <!-- Bootstrap基础样式 -->
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css" />
    <!-- 主题样式-->
    <link rel="stylesheet" href="/Content/css/green.css" />
    <!-- tooltip -->
    <link rel="stylesheet" href="/lib/qtip2/jquery.qtip.min.css" />
    <!-- 主要样式 -->
    <link rel="stylesheet" href="/Content/css/style.css" />

    <link rel="stylesheet" href="/Content/css/jquery.inputbox.css" />
    <!-- favicon -->
    <link rel="shortcut icon" href="/Content/fangdushi.ico" />

    <link href='/Content/css/googlefonts/OpenSans.css' rel='stylesheet' type='text/css'>


    <!--[if lte IE 8]>
            <link rel="stylesheet" href="/Content/css/ie.css" />
        <![endif]-->
    <!--[if lt IE 9]>
        <script src="/Scripts/ie/html5.js"></script>
        <script src="/Scripts/ie/respond.min.js"></script>
    <![endif]-->


</head>
<body>
    <div class="register_box">

        @*<form action="index.php?uid=1&amp;page=dashboard" method="post" id="pass_form" style="display:block">

                <div class="cnt_b">
                    <div class="formRow clearfix">
                        <div class="input-group">
                            <span class="input-group-addon input-sm">@@</span>
                            <input type="text" placeholder="Your email address" class="form-control input-sm" />
                        </div>
                    </div>
                </div>
                <div class="btm_b tac">
                    <button class="btn btn-default" type="submit">Request New Password</button>
                </div>
            </form>*@

        <form action="" method="post" id="reg_form" style="display: block">
            <div class="top_b">房产经纪人注册</div>
            <div class="cnt_b">

                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-phone"></i></span>
                        <input class="form-control input-sm" type="text" id="r_txtMobile" name="r_txtMobile" placeholder="请输入手机号码" value="">
                    </div>
                </div>
                <div class="form-group">

                    <div class="input-group">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-th-large"></i></span>

                        <div class="row">
                            <div class="col-sm-5">
                                <input class="form-control input-sm" type="text" id="r_txtMobileCAPTCHA" name="r_txtMobileCAPTCHA" placeholder="请输入短信验证码" value="">
                            </div>
                            <div class="col-sm-7">
                                <button type="button" class=" btn-xl btn-default" id="btnSMS" autocomplete="off">
                                    获取短信验证码
                                </button>
                            </div>
                        </div>


                    </div>

                </div>
                <div class="form-group">
                    <div class="input-group has-feedback" id="divPassword">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-lock"></i></span>

                        <input class="form-control input-sm" type="password" id="r_txtPassword" name="r_txtPassword" placeholder="请输入密码">

                    </div>
                    <label id="lblPaswordStatus" style="color: #C62626; font-weight: bold" class="sr-only">请输入密码</label>
                </div>
                <div class="form-group">
                    <div class="input-group  has-feedback" id="divPasswordConfirm">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-lock"></i></span>
                        <input class="form-control input-sm" type="password" id="r_txtPasswordConfirm" name="r_txtPasswordConfirm" placeholder="请输入确认密码" value="">
                    </div>
                    <label id="lblPaswordStatusConfirm" style="color: #C62626; font-weight: bold" class="sr-only">请输入确认密码</label>
                </div>
                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-user"></i></span>
                        <input class="form-control input-sm" type="text" id="r_txtRealName" name="r_txtRealName" placeholder="请输入真实姓名" value="">
                    </div>
                </div>

                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-list-alt"></i></span>
                        <div class="row" id="divChooseArea">
                            <div class="col-sm-4">
                                @*<input type="hidden" class="province" value="">*@

                                <div name="province" type="selectbox" style="z-index: 2; width: auto; height: 30px;" class="sb">

                                </div>
                            </div>
                            <div class="col-sm-4">
                                @*<input type="hidden" class="city" value="">*@

                                <div class="col-sm-2" name="city" type="selectbox" style="z-index: 2; width: auto; height: 30px;" class="sb">


                                </div>
                            </div>
                            <input type="hidden" id="r_txtDistrictNo" name="r_txtDistrictNo">

                        </div>
                    </div>



                </div>
                <div class="form-group">

                    <div class="checkbox  ">
                        <label>
                            <input type="checkbox" id="r_chkIsAlone" name="r_chkIsAlone">独立经纪人
                        </label>
                    </div>

                </div>

                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-tasks"></i></span>
                        <input class="form-control input-sm" type="text" id="r_txtAgency" name="r_txtAgency" placeholder="请输入所属公司" value="">
                    </div>
                </div>

                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-briefcase"></i></span>
                        <input class="form-control input-sm" type="text" id="r_txtAgencyBranch" name="r_txtAgencyBranch" placeholder="请输入所在门店" value="">
                    </div>
                </div>

                <div class="alert alert-warning alert-login">
                    <input type="checkbox" id="r_chkIsAccept" name="r_chkIsAccept">我已阅读并接受<a data-toggle="modal" href="#terms">《用户服务协议》</a>.
                </div>
                <div id="terms" class="modal fade">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                <h3 class="modal-title">房都市注册协议</h3>
                            </div>
                            <div class="modal-body">
                                <p>
                                    相关注册协议
                                </p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="regMessageForm" class="modal fade">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                <h3 class="modal-title">提示信息</h3>
                            </div>
                            <div class="modal-body" id="divRegMsg">

                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">关闭</button>
                            </div>
                        </div>
                    </div>
                </div>
                @*<div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon input-sm"><i class="glyphicon glyphicon-phone"></i></span>
                            <div class="row">
                                <div class="col-sm-6">
                                    <input class="form-control input-sm" type="text" id="r_txtAgencyBranch" name="r_txtAgencyBranch" placeholder="请输入校验码" value="">
                                </div>
                                <div class="col-sm-6">
                                    <img width="100" height="26" style="vertical-align:middle;border:0px;">
                                </div>
                            </div>
                        </div>
                    </div>*@

            </div>
            <div class="btm_b tac">
                <button class="btn btn-default" type="button" id="btnReg" name="btnReg" autocomplete="off">完成注册</button>
            </div>
        </form>

        @*<div class="links_b links_btm clearfix">
                <span class="linkform"><a href="#pass_form">忘记密码?</a></span>
                <span class="linkform" style="display:none"><a href="#login_form">点此返回登录界面</a></span>
            </div>*@

    </div>

    <script src="/Scripts/jquery.min.js"></script>
    <script src="/Scripts/jquery.actual.min.js"></script>

    <script src="/lib/validation/jquery.validate.js"></script>


    <script src="/Scripts/ie/jquery.placeholder.js"></script>

    <script src="/Scripts/jquery.form.js"></script>


    <!--省市联动查询-->
    <script src="/Scripts/jquery.ganged.js"></script>
    <script src="/Scripts/jquery.inputbox.js"></script>

    <!--自动下拉提示-->
    <script src="/lib/typeahead/bootstrap3-typeahead.js"></script>



    <script src="/Scripts/json2.js"></script>

    <script src="/bootstrap/js/bootstrap.min.js"></script>

    <script>
        var proviceData =@Html.Raw(Json.Encode(ViewData["proviceData"]))
        proviceData = JSON.parse(proviceData);
        var areaData = [];
        $.each(proviceData, function (i, item) {
            areaData.push(item["FDistrictNo"] + ":" + item["FDistrictName"]);
        });

    </script>

    <script>
        $(document).ready(function () {

            $('input, textarea').placeholder();
            document.onkeydown = function (e) {
                var ev = document.all ? window.event : e;
                if (ev.keyCode == 13) {
                    $("#btnReg").click();
                }
            }
            $("#btnSMS").click(function () {
                $('#r_txtMobile').validate();
                if ($('#r_txtMobile').valid()) {
                    setSMSTime($(this));
                    var mobileNo = $("#r_txtMobile").val();
                    $.ajax({
                        type: 'POST',
                        url: "/Realtor/GetMobileCAPTCHA",
                        data: { mobileNo: mobileNo },
                        success: function (data) {
                            if (data["code"] != 0) {
                                $('#regMessageForm').modal('show');
                                $("#divRegMsg").html(data["msg"]);
                            }

                        },
                        dataType: "json"
                    });
                }
            });
            $("#r_txtPassword").blur(function () {
                $("#lblPaswordStatus").addClass("sr-only");
                $("#divPassword").removeClass("has-error");
            });
            $("#r_txtPasswordConfirm").blur(function () {
                $("#lblPaswordStatusConfirm").addClass("sr-only");
                $("#divPasswordConfirm").removeClass("has-error");
            });
            $("#btnReg").attr("disabled", "disabled");
            $("#btnReg").click(function () {
                if ($("#r_chkIsAccept").is(":checked")) {
                    if ($('#reg_form').valid()) {
                        if ($.trim($("#r_txtPassword").val()) == "") {
                            $("#divPassword").addClass("has-error");
                            $("#lblPaswordStatus").removeClass("sr-only");
                            return false;
                        }
                        if ($.trim($("#r_txtPasswordConfirm").val()) == "") {
                            $("#divPasswordConfirm").addClass("has-error");
                            $("#lblPaswordStatusConfirm").removeClass("sr-only");
                            return false;
                        }
                        var options = {
                            cache: false,//
                            type: "POST",//发送方式
                            url: '/Realtor/Save',//url地址
                            data: $('#reg_form').serialize(),//.serialize()方法将form表单内所有数据组装
                            async: false,//同异步提交
                            error: function (request) {

                            },
                            success: function (date) {
                                var code = date["code"];
                                var msg = date["msg"];
                                $("#divRegMsg").html("");
                                if (code != 0) {
                                    $("#btnReg").removeAttr("disabled")
                                    $("#divRegMsg").html(msg);
                                    $('#regMessageForm').modal('show');
                                }
                                else {
                                    $('#regMessageForm').modal('show');
                                    $("#divRegMsg").html("注册成功！<a href='/Realtor/Login'>点此登录</a>");

                                }
                            },
                            dataType: "json"
                        }
                        $("#btnReg").attr("disabled", "disabled");
                        $("#reg_form").ajaxSubmit(options);
                    }
                }


            });
            $("#r_chkIsAlone").click(function () {
                if ($(this).is(":checked")) {
                    $("#r_txtAgency").val("");
                    $("#r_txtAgency").attr("disabled", "disabled");
                    $("#r_txtAgencyBranch").val("");
                    $("#r_txtAgencyBranch").attr("disabled", "disabled");
                }
                else {

                    $("#r_txtAgencyBranch").removeAttr("disabled");
                    $("#r_txtAgency").removeAttr("disabled");
                }
            });
            $("#r_chkIsAccept").click(function () {
                if ($(this).is(":checked")) {
                    $("#btnReg").removeAttr("disabled");
                }
                else {
                    $("#btnReg").attr("disabled", "disabled");
                }
            });

            //* boxes animation
            //form_wrapper = $('.login_box');
            //function boxHeight() {
            //    form_wrapper.animate({ marginTop: (-(form_wrapper.height() / 2) - 24) }, 400);
            //};
            //form_wrapper.css({ marginTop: (-(form_wrapper.height() / 2) - 24) });
            //$('.linkform a,.link_reg a').on('click', function (e) {
            //    var target = $(this).attr('href'),
            //    target_height = $(target).actual('height');
            //    $(form_wrapper).css({
            //        'height': form_wrapper.height()
            //    });
            //    $(form_wrapper.find('form:visible')).fadeOut(400, function () {
            //        form_wrapper.stop().animate({
            //            height: target_height,
            //            marginTop: (-(target_height / 2) - 24)
            //        }, 500, function () {
            //            $(target).fadeIn(400);
            //            $('.links_btm .linkform').toggle();
            //            $(form_wrapper).css({
            //                'height': ''
            //            });
            //        });
            //    });
            //    e.preventDefault();
            //});

            //* validation
            //$('#login_form').validate({
            //    onkeyup: false,
            //    errorClass: 'error',
            //    validClass: 'valid',
            //    rules: {
            //        username: { required: true, minlength: 3 },
            //        password: { required: true, minlength: 3 },

            //    },
            //    highlight: function (element) {
            //        $(element).closest('.form-group').addClass("f_error");
            //        setTimeout(function () {
            //            boxHeight()
            //        }, 200)
            //    },
            //    unhighlight: function (element) {
            //        $(element).closest('.form-group').removeClass("f_error");
            //        setTimeout(function () {
            //            boxHeight()
            //        }, 200)
            //    },
            //    errorPlacement: function (error, element) {
            //        $(element).closest('.form-group').append(error);
            //    }
            //});

            $('#reg_form').validate({
                onkeyup: false,
                errorClass: 'error',
                validClass: 'valid',
                rules: {
                    r_txtMobile: { required: true },
                    r_txtMobileCAPTCHA: { required: true },
                    r_txtPassword: { required: true },
                    r_txtPasswordConfirm: {
                        required: true,
                        equalTo: "#r_txtPassword"
                    },
                    r_txtRealName: { required: true },
                    r_txtDistrictNo: { required: true },
                    r_txtAgency: { required: true },
                    r_txtAgencyBranch: { required: true }

                },
                /* 设置错误信息 */
                messages: {
                    r_txtMobile: {
                        required: "请输入手机号码"

                    },
                    r_txtMobileCAPTCHA: {
                        required: "请输入短信验证码"
                    },
                    r_txtPassword:
                        {
                            required: "请输入密码",
                            minlength: "密码至少6位"
                        },
                    r_txtPasswordConfirm:
                        {
                            required: "请输入确认密码",
                            equalTo: "两次输入密码不一致"
                        },
                    r_txtRealName:
                        {
                            required: "请输入真实姓名",
                        },
                    r_txtDistrictNo:
                        {
                            required: "请选择所在城市"
                        },
                    r_txtAgency:
                        {
                            required: "请输入所属公司"
                        },
                    r_txtAgencyBranch:
                        {
                            required: "请输入所在门店"
                        }



                },
                highlight: function (element) {
                    $(element).closest('.form-group').addClass("f_error");
                    //setTimeout(function () {
                    //    boxHeight()
                    //}, 200)
                },
                unhighlight: function (element) {
                    $(element).closest('.form-group').removeClass("f_error");
                    //setTimeout(function () {
                    //    boxHeight()
                    //}, 200)
                },
                errorPlacement: function (error, element) {
                    $(element).closest('.form-group').append(error);
                }

            });


            $("#btnLogin").click(function () {
                window.location.href = "/Realtor/RealtorInfo";
                return false;
            });





            $('#divChooseArea').ganged({ 'data': areaData, 'width': 110, 'height': 30 });




            var $r_txtAgency = $('#r_txtAgency');
            $r_txtAgency.typeahead({
                source: [
                ],
                autoSelect: true
            });
            var $r_txtAgencyBranch = $("#r_txtAgencyBranch")
            $r_txtAgencyBranch.typeahead({
                source: [],
                autoSelect: true
            });

            $r_txtAgency.change(function () {
                var current = $r_txtAgency.typeahead("getActive");
                if (current) {
                    // Some item from your model is active!
                    if (current.name == $r_txtAgency.val()) {
                        // This means the exact match is found. Use toLowerCase() if you want case insensitive match.
                        $r_txtAgencyBranch.data('typeahead').source = [];
                        $r_txtAgencyBranch.val("");
                        var agencyID = current.id;
                        $.ajax({
                            type: 'POST',
                            url: "/Realtor/GetAgencyBranchList",
                            data: { agencyID: agencyID },
                            success: function (data) {
                                var $r_txtAgencyBranch = $('#r_txtAgencyBranch');
                                $r_txtAgencyBranch.data('typeahead').source = data;
                            },
                            dataType: "json"
                        });

                    } else {
                        // This means it is only a partial match, you can either add a new item
                        // or take the active if you don't want new items
                    }
                } else {
                    // Nothing is active so it is a new value (or maybe empty value)
                }
            });

            //$r_txtAgencyBranch.change(function () {
            //    var current = $r_txtAgencyBranch.typeahead("getActive");
            //    if (current) {
            //        // Some item from your model is active!
            //        if (current.name == $r_txtAgencyBranch.val()) {
            //            // This means the exact match is found. Use toLowerCase() if you want case insensitive match.
            //        } else {
            //            // This means it is only a partial match, you can either add a new item
            //            // or take the active if you don't want new items
            //        }
            //    } else {
            //        // Nothing is active so it is a new value (or maybe empty value)
            //    }
            //});



        });

        var wait = 120;//时间
        function setSMSTime(o, p) {//o为按钮的对象，p为可选，这里是120秒过后，提示文字的改变
            if (wait == 0) {
                o.removeAttr("disabled");
                o.html("点击发送验证码");//改变按钮中value的值
                //p.html("如果您在1分钟内没有收到验证码，请检查您填写的手机号码是否正确或重新发送");
                wait = 120;
            } else {
                o.attr("disabled", true);//倒计时过程中禁止点击按钮
                o.html(wait + "秒后重新获取验证码");//改变按钮中value的值
                wait--;
                setTimeout(function () {
                    setSMSTime(o, p);//循环调用
                },
                1000)
            }
        }
    </script>

</body>


</html>
